<template>
  <div class="base-content">
    <!--列表-->
    <el-table
      ref="table"
      v-loading="tableLoad"
      :data="tableData"
      fit
      highlight-current-row
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55"> </el-table-column>
      <el-table-column prop="sampleNum" label="样品编号"> </el-table-column>
      <el-table-column prop="sampleName" label="样品名称"> </el-table-column>
      <el-table-column prop="sampleModel" label="产品型号"> </el-table-column>
      <el-table-column label="检测项目">
        <template slot-scope="{ row }">
          <div @click="showInfo(row)">
            {{ row.entrustDetectionGetListRequest.length }}
          </div>
        </template>
      </el-table-column>
      <el-table-column prop="sampleCount" label="送样数量" />
      <el-table-column prop="sampleCollectionCount" label="领取数量" />
      <el-table-column
        prop="sampleCollectionDate"
        label="领取日期"
        :formatter="formatTableTime"
      />
      <el-table-column prop="permissionUserName" label="领取人" />
    </el-table>
    <el-dialog
      v-if="detectionDialog"
      class="base-dialog"
      :class="{ readonly: readOnly }"
      :custom-class="'panna-dialog_small'"
      :title="title"
      align="center"
      :append-to-body="true"
      :visible.sync="detectionDialog"
      :before-close="handleClose2"
    >
      <p slot="title">检测项目</p>
      <el-table
        ref="table"
        height="350px"
        :data="detectionData"
        style="width: 100%"
      >
        <el-table-column prop="detectionItemName" label="检测项目" width="180">
        </el-table-column>
        <el-table-column
          prop="methodStandardNum"
          label="方法标准编号"
          width="180"
        >
        </el-table-column>
        <el-table-column prop="nationalStandardNum" label="产品标准编号">
        </el-table-column>
      </el-table>
    </el-dialog>
    <!--分页-->
    <!--BasePagination
      :total="pagination.total"
      :current-page="pagination.pageIndex"
      :page-count="pagination.pageCount"
      @changePage="changePage"
    /-->
  </div>
</template>
<script>
import { formatTime } from "../../../utils/time";
import { getList } from "../../../api/SampleManage/SampleCollection";
export default {
  name: "SampleCollectionFinished",
  components: {},
  props: {
    filterForm: {
      type: Object,
      default() {},
    },
    pageInfo: {
      type: Object,
      default: () => {
        return {
          pageIndex: 1,
          pageSize: 10,
        };
      },
    },
  },
  data() {
    return {
      detectionData: [],
      detectionDialog: false,
      dialogFormVisible: false,
      loading: false,
      pagination: {
        pageIndex: 1,
        pageSize: 10,
        total: 0,
      },
      tableLoad: false,
      tableData: [],
      tableDatas: [],
    };
  },
  computed: {},
  watch: {},
  created() {
    this.getList();
  },
  methods: {
    handleClose2() {
      this.detectionData = [];
      this.detectionDialog = false;
    },
    showInfo(row) {
      this.detectionData = [];
      this.detectionData = row.entrustDetectionGetListRequest;

      this.detectionDialog = true;
    },
    formatTableTime(row) {
      if (
        row.sampleCollectionDate !== null &&
        row.sampleCollectionDate !== ""
      ) {
        return formatTime(row.sampleCollectionDate);
      }
    },
    // 关闭样品接收dialog
    closeSampleReceivingDialog() {
      this.getList();
    },

    handleSelectionChange(val) {
      this.tableDatas = val;
    },
    getList(flag) {
      this.loading = true;
      getList({ ...this.filterForm, ...this.pageInfo })
        .then((res) => {
          this.tableData = res.data.dataList ? res.data.dataList : [];
          this.$emit("update:total", res.data.total);
          this.loading = false;
        })
        .catch(() => {
          this.loading = false;
        });
    },
  },
};
</script>
